<!-- 判断id，选择性加载 -->
<div>
    <div>
        <!-- 图片 -->
        <div>
            <img src={{src}}>
            <span class='depreciate'>直降</span>
        </div>
        <!-- 商品级别描述 -->
        <p class='quality'>特级 优质 宿苜草/粉末</p>
        <!-- 价格 -->
        <div class='price'>
            <!-- 现价 -->
            <div id='currentPrice' class='f40'>￥{{parList['g_price']}}/t</div>
            <!-- 原价 -->
            <div id='originalPrice'>
                <div> 原价: <span class='f40'>￥{{parList['originalPrice']}}/t</span></div>
            </div>
            <!-- 销量 -->
            <p class='salesVolume'>销量：666</p>
        </div>
    </div>
    <!-- 下部 -->
    <div class='underAll'>
        <span class='details'>
          <!-- 按钮上方红线 -->
          <div class='sl' *ngIf="showEst"></div>
          <div class='sr' *ngIf="showPar"></div>
          <!-- 详情按钮 -->
        <button  (click)="goShowPar()">商品详情</button>
        <!-- 评价按钮 -->
        <button  (click)="goShowEst()">评价（{{num}}）</button>
      </span>

        <div class='body'>
            <!-- 详情内容 -->
            <div *ngIf="showPar">
                {{par}}
            </div>
            <!-- 评价内容 -->
            <ul *ngIf="showEst">
                <li *ngFor="let item of estList">
                    <!-- 用户信息 -->
                    <img src="../../assets/images/个人中心/u1810.png" alt="头像">
                    <!-- 评价用户id -->
                    <p class="userId">{{item.user_id}}</p>
                    <!-- 用户评价时间 -->
                    <p class='time'>明天 25:00</p>
                    <!-- 评价内容 -->
                    <p class='content'>{{item.word}}</p>
                </li>
            </ul>
        </div>
    </div>
    <app-tabbar-buy (checked)="checkedBack($event)" [hadNum]='hadNum'></app-tabbar-buy>
    <!-- 背景变暗 -->
    <div class='black' #black ng *ngIf='ifAdd'>
        <!-- 加入购物车 -->
        <div class='addCart' #addCart>
            <!-- 图片和直降 -->
            <div class='add-img'>
                <img src={{src}}>
                <span class='cartDepreciate'>直降</span>
            </div>
            <!-- 关闭按钮 -->
            <img src="../../assets/images/index/u496.png" class='close' (click)="closeAdd()">
            <!-- 价格 -->
            <div class='cartPrice'>
                <!-- 现价 -->
                <div id='cartCurrentPrice' class='f40'>￥{{parList['g_price']}}/t</div>
                <!-- 原价 -->
                <div id='cartOriginalPrice'>
                    <div> 原价: <span class='f40'>￥{{parList['originalPrice']}}/t</span></div>
                </div>
                <!-- 库存 -->
                <p class='inventory'>库存：888t</p>
                <!-- 销量 -->
                <p class='cartSalesVolume'>销量：666t</p>
            </div>
            <!-- 加购数量 -->
            <div class='add-num'>
                <p class="units">购买数量：</p>
                <button class='sub' (click)="subOne()" [disabled]='canSub'>-</button>
                <input type="text" class='input' [(ngModel)]="addNum">
                <button class='add' (click)="addOne()">+</button>
                <p class='units'>t/kg</p>
                <p class='ok' (click)="ok()">确定</p>
            </div>
        </div>
    </div>
</div>
<!-- 占位 -->
<div class='footer'></div>
